<template>
	<view>
		<Header :isBack="true">
			<block slot="content">{{title}}</block>
		</Header>
		<!-- 快捷方式 -->
		<view class="list">
			<view class="list-item">
				<view class="" style="width:350rpx;display: inline-block;">
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm1.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm2.jpg"
						mode="">
					</image>
				</view>
				<view class="list-item-text">
					1.企业登录之后，在
					<navigator url="/pages/index/index" class="active">首页</navigator>
					首先找到发布项目的栏目，之后选择要发布项目的大分类，点击进去选择小分类（如下图）
				</view>
			</view>
			<view class="list-item">
				<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm3.jpg" mode="">
				</image>
				<view class="list-item-text">
					2.输入项目名称，选择性别，输入最低年龄，最高年龄，工资/天，选择开工日期/时间，输入工作天数，职位描述，选择工作地区，输入详细地址等，点击发布即可
				</view>
			</view>
			<view class="list-item">
				<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm4.jpg" mode="">
				</image>
				<view class="list-item-text">
					3.发布成功之后，发布的项目会进入发布管理，企业可以看到发布项目的审核状态
				</view>
			</view>
			<view class="list-item">
				<view class="" style="width:350rpx;display: inline-block;">
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm5.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm6.jpg"
						mode="">
					</image>
				</view>
				<view class="list-item-text">
					4.发布的项目通过后台审核之后，会展示在首页，供劳务工人选择，待劳务工人预约之后，该项目会显示在我的预约
				</view>
			</view>
			<view class="list-item">
				<view class="" style="width:350rpx;display: inline-block;">
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm9.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm10.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm11.jpg"
						mode="">
					</image>
				</view>
				<view class="list-item-text">
					5.项目开工之后，该项目会自动显示在我的发布 -> 已发布列表中，企业需要点击去支付按钮，选择微信或支付宝等支付方式，支付该工程订单
				</view>
			</view>
			<view class="list-item">
				<view class="" style="width:350rpx;display: inline-block;">
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm12.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm13.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm14.jpg"
						mode="">
					</image>
				</view>
				<view class="list-item-text">
					6.支付完成订单之后，该项目会进入到我的发布 -> 工作中列表中，表示该项目现在正处于施工阶段。等到项目完工以后，企业需点击项目完成按钮，表示该项目已完成施工
				</view>
			</view>
			<view class="list-item">
				<view class="" style="width:350rpx;display: inline-block;">
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm15.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm16.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm17.jpg"
						mode="">
					</image>
					<image class="list-item-img" src="https://liande.oss-cn-beijing.aliyuncs.com/docs/qyfbxm18.jpg"
						mode="">
					</image>
				</view>
				<view class="list-item-text">
					7.该项目施工完成之后，会进入到我的发布 -> 已完成列表中。等到后台审核确认该项目已完成之后，会对工人进行工资结算，该项目会进入到已结算，之后整个项目完全结束
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				title: '发布流程'
			};
		},

		computed: {

		},
		components: {

		},

		onLoad() {

		},
		methods: {

		},
	}
</script>

<style>
	page {
		background-color: #f7f7f7;
		font-size: $font-base;
	}
</style>

<style lang="scss" scoped>
	/* 快捷方式 */

	.list {
		// #ifdef APP-PLUS
		padding: 160rpx 0rpx 120rpx;
		// #endif

		// #ifdef H5
		padding: 110rpx 0rpx 120rpx;
		// #endif
		
		// #ifdef MP-WEIXIN
		padding: 165rpx 0rpx 120rpx;
		// #endif

		.list-item {
			position: relative;
			background: #fff;
			margin-bottom: 10rpx;
			padding: 0 20rpx;

			.list-item-img {
				width: 350rpx;
				height: 785rpx;
			}

			.list-item-text {
				width: 320rpx;
				position: absolute;
				right: 20rpx;
				display: inline-block;
				text-align: justify;
			}
		}
	}

	.active {
		color: $base-color;
		font-size: $font-lg;
		margin: 0 5rpx;
		display: inline;

	}
</style>
